<template>
  <div style="height: 50px;">
    <div class="copyright">
      <span>Copyright © {{company}} All Rights Reserved</span>
<!--      <a :href="href">{{copyright}}</a>-->
    </div>
  </div>
</template>

<script>
  export default {
    data() {
      return {
        href: '#',
        copyright: '***',
        company: 'YZS'
      }
    }
  }
</script>

<style lang="scss" scoped>
  .copyright{
    z-index: 99;
    position: absolute;
    width: 100%;
    bottom: 0;
    height: 50px;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    span{
      color: #606266;
      transition: .35s;
    }
    a{
      color: #606266;
      margin-left: 5px;
      transition: .35s;
      &:hover {
        color: #0000ee;
      }
    }
    @media (max-width: 768px) {
      font-size: 14px;
      flex-direction: column;
    }

    @media (max-width: 414px) {
      font-size: 12px;
      row-gap: 3px;
    }
  }
</style>
